<template>
  <!-- 呆滞件交易平台 -->
  <div>
    <TopFilter :list="platformTopFilterList" :cols="3" :rows="2" @filterChange="changeHandle" @onCollapse="collapseHandle"></TopFilter>
    <FilterTable
      ref="table"
      columnsRef="partExchangePlatformIndex"
      :columns="columns"
      :fetchapi="fetchApi"
      :params="fetchParams"
      :datakey="'records'"
      :onColumnsChange="columns => (this.columns = columns)"
    >
      <template slot="controls" slot-scope="props">
        <el-button size="small" type="primary" icon="el-icon-plus" :disabled="newBtn" @click="publishInfo">信息发布</el-button>
        <!-- <AjaxButton :disabled="releaseBtn" :click="pushDialog" type="primary">发布</AjaxButton> -->
        <AjaxButton :disabled="offlineBtn" :click="offlineDialog" type="primary">下线</AjaxButton>
      </template>
    </FilterTable>
    <!-- 信息发布弹窗 -->
    <Drawer :visible.sync="visible" :title="dialogTitle" destroyOnClose :containerStyle="{ height: 'calc(100% - 60px)', overflow: 'auto', paddingBottom: '60px' }">
      <ReleaseInfo :pruchaseInfos="pruchaseInfos" :tax="tax" @close="closeHandler" />
    </Drawer>
    <!-- 购买弹窗 -->
    <BaseDialog :visible.sync="visible1" :title="dialogTitle1" destroyOnClose :containerStyle="{ height: 'calc(100% - 60px)', overflow: 'auto', paddingBottom: '60px' }">
      <exchangePartBuy :partsInfos="partsInfos" :saveData="saveData" @close="closeBuyHandler" />
    </BaseDialog>
    <BaseDialog :visible.sync="visibleBuy" :title="dialogTitle1" destroyOnClose :containerStyle="{ height: 'calc(100% - 60px)', overflow: 'auto', paddingBottom: '60px' }">
      <exchangePartSale :partsInfos="partsInfos" :saveData="saveData" @close="closeSaleHandler" />
    </BaseDialog>
  </div>
</template>

<script>
import { getColors, addColor, updateColor } from '@/api/common/cars/colorCars';
import { saveInfo, getInfo, offline } from '@/api/part/exchange/platform';
import ReleaseInfo from './releaseInfo';
import exchangePartSale from '@/pages/part/exchange/platform/tabs/partsSale';
import exchangePartBuy from '@/pages/part/exchange/platform/tabs/partBuy';
import { dictionary } from '@/utils/dictMixin';
import { getOwnerCode, getDataType } from '@/assets/js/auth';
import { queryTex } from '@/api/part/common';

export default {
  name: 'ExchangePlatform',
  components: { ReleaseInfo, exchangePartSale, exchangePartBuy },
  mixins: [dictionary],
  data() {
    this.pruchaseInfos = { price: '销售', number: '剩余', details: '购买', name: '出售' };
    this.saveData = {};
    return {
      platformTopFilterList: this.createTopFilters(),
      columns: this.createTableColumns(),
      // 开启ajax请求
      fetchParams: { xhrAbort: true, saleType: 97011002 },
      // 条件查询接口
      fetchApi: getInfo,
      visible: false,
      visible1: false,
      dialogTitle: '',
      dialogTitle1: '',
      titleName: '',
      type: '',
      partsInfos: this.pruchaseInfos,
      clickText: '出售',
      visibleBuy: false,
      releaseBtn: false,
      offlineBtn: false,
      newBtn: false,
      tax: Number // 税率
    };
  },
  created() {
    this.getInitParams();
  },
  methods: {
    // 初始化查询参数
    async getInitParams() {
      let res = await queryTex();
      this.tax = Number(res.data);
      // console.log(this.tax, '税率');
    },
    // 按钮恢复初始状态
    initialBtnStatus() {
      (this.releaseBtn = false), (this.offlineBtn = false), (this.newBtn = false);
    },
    // 下线各按钮状态
    offlineStatus() {
      (this.releaseBtn = true), (this.offlineBtn = false), (this.newBtn = true);
    },
    // 创建状态
    createStatus(val) {},
    // 类型变化回调
    purchase(val) {
      if (val == 97011001) {
        // 我要买
        this.columns.find(item => item.dataIndex == 'remainingQuantity').title = '剩余数量';
        this.columns.find(item => item.dataIndex == 'inOutTaxedPrice').title = '含税销售价格';
        this.clickText = '购买';
      } else {
        // 我要卖
        this.columns.find(item => item.dataIndex == 'remainingQuantity').title = '求购数量';
        this.columns.find(item => item.dataIndex == 'inOutTaxedPrice').title = '含税购买价格';
        this.clickText = '出售';
      }
      // console.log(val, '类型选择');

      // this.fetchParams = { ...this.fetchParams, saleType: val };
      // 初始化按钮状态
      this.initialBtnStatus();
    },
    // 操作列
    editHandle(val) {
      this.saveData = val;
      console.log(this.saveData);
      if (this.clickText == '购买') {
        this.visible1 = true;
        this.dialogTitle1 = '奥迪EP平台----配件购买';
      } else if (this.clickText == '出售') {
        this.visibleBuy = true;
        this.dialogTitle1 = '奥迪EP平台----配件出售';
      } else {
        // 下线处理
        this.offlineHandler(val);
      }
    },
    // 对消息进行下线处理
    async offlineInfo(val) {
      let res = await offline(val.partPlatformId);
      if (res.resultCode == 200) {
        // 刷新页面
        this.fetchParams = { ...this.fetchParams };
        this.initialBtnStatus();
        return this.$notify.success({ title: '提示信息', message: '下线成功' });
      }
    },
    // 点击关闭按钮触发事件
    closeHandler(val, type, saleType) {
      this.visible = val;
      this.platformTopFilterList.find(item => item.fieldName == 'saleType').initialValue = saleType;
      // if (type === 'refresh') {
      //   // 重新加载
      //   this.fetchParams = { ...this.fetchParams };
      // }
      this.purchase(saleType);
    },
    closeBuyHandler() {
      this.visible1 = false;
    },
    closeSaleHandler() {
      this.visibleBuy = false;
    },
    // 点击下线处理按钮
    offlineDialog() {
      this.platformTopFilterList.find(item => item.fieldName == 'ownerCode').initialValue = getOwnerCode();
      this.offlineStatus();
      this.changeHandle({ ownerCode: getOwnerCode(), saleType: this.platformTopFilterList.find(item => item.fieldName == 'saleType').initialValue });
      this.clickText = '下线';
    },
    // 点击新建
    publishInfo() {
      // this.handleType = 'add';
      this.titleName = '信息发布';
      this.showHandler();
      this.visible = true;
    },
    // 删除提示
    async offlineHandler(val) {
      await this.$confirm('此操作将永久删除该文件, 是否继续?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      });
      this.offlineInfo(val);
    },
    // 删除调用接口
    deleteDialog() {
      alert('正在删除');
    },
    // 显示处理
    showHandler() {
      this.dialogTitle = this.titleName;
    },

    // 点击搜索按钮触发的事件，参数是搜索条件对象
    changeHandle(val) {
      this.purchase(val.saleType);
      if (val.dateEnd) {
        let arr = val.dateEnd.split(' ');
        val.dateEnd = arr[0].concat(' 23:59:59');
      }
      this.fetchParams = Object.assign({}, val);
      this.columns = [...this.columns];
    },

    // 展开-收起时的回调函数
    collapseHandle() {
      this.$nextTick(() => {
        this.$refs.table.EXECUTE_RESET_HEIGHT();
      });
    },

    // 搜索条件
    createTopFilters() {
      return [
        {
          type: 'INPUT',
          label: '配件代码',
          fieldName: 'partNo',
          placeholder: ''
          // readonly: true
        },
        {
          type: 'INPUT',
          label: '配件名称',
          fieldName: 'partName',
          placeholder: ''
        },
        {
          type: 'SELECT',
          label: '信息类型',
          fieldName: 'saleType',
          clearable: false,
          itemList: this.createDictList('9701'),
          initialValue: 97011002,
          // change: this.purchase,
          placeholder: ''
        },
        {
          type: 'INPUT',
          label: '经销商代码',
          fieldName: 'ownerCode',
          placeholder: ''
        },
        {
          type: 'INPUT',
          label: '经销商名称',
          fieldName: 'dearlerName',
          placeholder: ''
        },
        {
          type: 'RANGE_DATE',
          label: '发布日期',
          fieldName: 'dateBegin|dateEnd',
          placeholder: ''
        }
      ];
    },
    // table列
    createTableColumns() {
      return [
        {
          title: '操作',
          dataIndex: 'column-action',
          fixed: 'left',
          // sorter: true,
          // filter: true,
          // filterType: 'input',
          render: props => {
            return (
              <div>
                <el-button size="mini" type="text" onClick={() => this.editHandle(props.row)}>
                  {this.clickText}
                </el-button>
              </div>
            );
          }
        },
        {
          title: '序号',
          dataIndex: 'index',
          width: 90,
          // fixed: 'left',
          sorter: true,
          render: props => {
            return <span>{props.row.$index + 1}</span>;
          }
        },

        {
          title: '配件代码',
          dataIndex: 'partNo',
          sorter: true,
          filter: true,
          filterType: 'input'
        },
        {
          title: '配件名称',
          dataIndex: 'partName',
          sorter: true,
          filter: true,
          filterType: 'input'
        },
        {
          title: '所属经销商',
          dataIndex: 'ownerName',
          sorter: true,
          filter: true,
          filterType: 'input'
        },
        {
          title: '联系人',
          dataIndex: 'contacts',
          sorter: true,
          filter: true,
          filterType: 'input'
        },
        {
          title: '联系电话',
          dataIndex: 'contactorMobile',
          sorter: true,
          filter: true,
          filterType: 'input'
        },
        {
          title: '地址',
          dataIndex: 'contactorAddress',
          sorter: true,
          filter: true,
          filterType: 'input'
        },
        {
          title: '所属大区',
          dataIndex: 'dealerRegionName',
          sorter: true,
          filter: true,
          filterType: 'input'
        },
        {
          title: '所属小区',
          dataIndex: 'dealerAreaName',
          sorter: true,
          filter: true,
          filterType: 'input'
        },
        {
          title: '含税销售价格',
          dataIndex: 'inOutTaxedPrice',
          precision: 2,
          sorter: true,
          filter: true,
          filterType: 'number'
        },
        {
          title: '剩余数量',
          dataIndex: 'remainingQuantity',
          sorter: true,
          filter: true,
          filterType: 'number'
        },
        {
          title: '发布日期',
          dataIndex: 'createdAt',
          dateFormat: 'yyyy-MM-dd',
          sorter: true,
          filter: true,
          filterType: 'date-range'
        },
        {
          title: '到期日期',
          dataIndex: 'endDate',
          dateFormat: 'yyyy-MM-dd',
          sorter: true,
          filter: true,
          filterType: 'date-range'
        },
        {
          title: '状态',
          dataIndex: 'status',
          sorter: true,
          filter: true,
          filterType: 'checkbox',
          filterItems: this.createDictList('9700'),
          render: props => {
            return <span>{this.createDictText(props.row.status, '9700')}</span>;
          }
        }
      ];
    }
  }
};
</script>

<style></style>
